
@extends('admin.comment.main')

@section('content')
<article class="page-container">
    @include('admin.comment.validate')
    @include('admin.comment.success')
    <form  style="width: 1000px;height: 500px;align-content: center" action="{{ route('admin.user.updateMyself')  }}" method="post" class="form form-horizontal" id="storeForm">
        @csrf
        @method('PUT')
        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>用户名：</label>
            <div class="formControls col-xs-8 col-sm-9">
                <input autocomplete="on" type="text" class="input-text" value="{{auth()->user()->username}}"  id="username" name="username" disabled>
            </div>
        </div>
        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>真名：</label>
            <div class="formControls col-xs-8 col-sm-9">
                <input autocomplete="on" type="text" class="input-text" value="{{auth()->user()->truename}}"  id="truename" name="truename">
            </div>
        </div>
        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>原密码：</label>
            <div class="formControls col-xs-8 col-sm-9 checkpwd">
                <input autocomplete="on" type="password" class="input-text " value=""  id="password" name="password">
            </div>
        </div>
        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>新密码：</label>
            <div class="formControls col-xs-8 col-sm-9">
                <input autocomplete="on" type="password" class="input-text" value=""  id="new_password" name="new_password">
            </div>
        </div>
        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>确认密码：</label>
            <div class="formControls col-xs-8 col-sm-9">
                <input autocomplete="on" type="password" class="input-text" value=""  id="new_password_confirmation" name="new_password_confirmation">
            </div>
        </div>
        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>性别：</label>
            <div class="formControls col-xs-8 col-sm-9 skin-minimal">
                <div class="radio-box">
                    <input name="gender" type="radio" value="男"  id="sex-1" @if(auth()->user()->gender=='男') checked @endif>
                    <label for="sex-1">男</label>
                </div>
                <div class="radio-box">
                    <input type="radio" value="女" id="sex-2" name="gender" @if(auth()->user()->gender=='女') checked @endif>
                    <label for="sex-2">女</label>
                </div>
            </div>
        </div>
        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>手机：</label>
            <div class="formControls col-xs-8 col-sm-9">
                <input autocomplete="on" type="text" class="input-text" value="{{auth()->user()->phone}}" placeholder="" id="phone" name="phone">
            </div>
        </div>
        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>邮箱：</label>
            <div class="formControls col-xs-8 col-sm-9">
                <input autocomplete="on" type="email" value="{{auth()->user()->email}}" class="input-text" placeholder="" name="email" id="email">
            </div>
        </div>

        <div class="row cl">
            <div class="col-xs-8 col-sm-9 col-xs-offset-4 col-sm-offset-3">
                <input class="btn btn-primary radius updateUser"  type="submit" value="&nbsp;确认修改&nbsp;">
            </div>
        </div>
    </form>
</article>
@endsection('content')

@section('js')
<script type="text/javascript" src="/admin/lib/jquery.validation/1.14.0/jquery.validate.js"></script>
<script type="text/javascript" src="/admin/lib/jquery.validation/1.14.0/messages_zh.js"></script>
<script type="text/javascript" src="/admin/lib/jquery.validation/1.14.0/validate-methods.js"></script>


<script type="text/javascript">
    //表单校验
    $('#storeForm').validate({
        rules: {
            username: 'required',
            truename: 'required',
            password: 'required',
            new_password_confirmation : {

                equalTo: "#new_password"
            },
            email: {
                required: true,
                email: true
            },
            phone: {
                required: true,
                phone: true
            }
        },
        messages: {
            truename:{
                required:'真实名称必须填写'
            }
        },
        success: "valid",
        submitHandler:function(form) {
            $(form).submit(); //注意不用ajaxSubmit
        }
    })
    //自定义phone的校验规则
    jQuery.validator.addMethod("phone", function(value, element) {
        var reg1 = /^\+86-1[3-9]\d{9}$/;
        var reg2 = /^1[3-9]\d{9}$/;
        return reg1.test(value) || reg2.test(value);
    }, "请正确填写您的手机号");

    //ajax判断原密码是否正确
    $('#password').focusout(function (){
        let url = "{{route('admin.user.checkpwd')}}";
        let password = $(this).val();
        $.ajax({
            url,
            data: {
                _token: "{{csrf_token()}}",
                password,
            },
            type: 'POST'
        }).then( ({status,msg}) =>{
            if (status == 1){
                $('.status').remove();
                let e = '<span style="font-size: 20px;color: #00B83F" class="status Hui-iconfont Hui-iconfont-shenhe-tongguo "></span>';
                $(this).after(e);
            }else{
                $('.status').remove();
                let e = '<span class="status" style="font-size: 10px;color: red" >密码错误</span>';
                $(this).after(e);
            }
        })
    })


</script>
@endsection



